<template>
  <div class="footerContainer">
    <div class="leftBox">
      <div>找工作、看面经、获分享、得经验</div>
      <div class="leftBoxChild">
        <div class="picture">
          <div class="erweima">
            <img src="../assets/logo.png" alt="">
          </div>
        <div>扫一扫，加入官方交流群</div>
        </div>
        <div>
          关注就业，提前准备
        </div>
      </div>

    </div>
    <div class="line">

    </div>
    <div class="rightBox">
      <ul class="list">
        <li>关于我们</li>
        <li>加入我们</li>
        <li>意见反馈</li>
        <li>联系我们</li>
        <li>校企合作</li>
        <li>友情链接</li>
      </ul>
    </div>
  </div>
</template>

<script>
export default {

}
</script>

<style scoped>
.footerContainer{
  box-sizing: border-box;
  display: flex;
  width: 100vw;
  height: 200px;
  min-height: 200px;
  background-color: #ffffff;
  padding: 20px 200px;
  font-size: 20px;
  font-weight: 400px;
}

.leftBox{
  width:50%;
}
.line{
  width: 2px;
  background-color: black;
  height: 100%;
  margin: 0 20px;
  align-self: center;
}
.rightBox{
  width:50%;
}
.list{
  display: flex;
  flex-wrap: wrap;
}
.list li{
  width: 20%;
  text-align: center;
  margin: 5px 0;
  font-size: 16px;
}
.leftBoxChild{
  display: flex;
  margin-left:80px;
  align-items: center;
}
.picture{
  display: flex;
  flex-direction: column;
  align-items: center;
}
.picture .erweima img{
  width: 100px;
  height: 100px;
}
</style>
